import { useSelector } from 'react-redux'
import { RootState } from '../store'
import { componentInfoType } from '../store/componentsReducer'

function useGetComponentInfo() {
  const components = useSelector((state: RootState) => state.components.present)

  const { componentsList = [], selectedId, copiedComponent } = components

  const getSelectedComponent = () => {
    if (!selectedId) {
      return {}
    }
    return componentsList.find(c => c._id === selectedId) || {}
  }

  return {
    // 当前画布中的所有组件
    componentsList,
    // 当前选中的组件id
    selectedId,
    // 当前被复制的组件信息
    copiedComponent,
    // 获取当前选中的组件配置
    selectedComponent: getSelectedComponent() as componentInfoType
  }
}

export default useGetComponentInfo
